{extend name="index/Mindex"/}

{block name="lunbo"}

<link rel="stylesheet" type="text/css" href="http://www.jq22.com/jquery/bootstrap-3.3.4.css">
<link rel="stylesheet" href="/static/index/two/css/thumbnail-gallery.css">
<style>
    .jq22-demo{ text-align: center; margin-top: 30px; }
    .jq22-demo a{ padding-left: 20px; padding-right: 20px; }
</style>

<div class="htmleaf-container">
    <p style="float:right;margin-right:20px;margin-top:10px;"><a href="/">首页</a></p>
    <div class="container gallery-container">
        <h1>《民房》</h1>
        <p class="page-description text-center"></p>
        <div class="tz-gallery">
            <div class="row">
               {volist name="housedatails" id="vo"}
                <div class="col-sm-6 col-md-4">
                    <div class="thumbnail">
                        <a class="lightbox" href="{:url('index/villa/detail',['id'=>$vo['id']])}">
                            <img src="/uploads/housepic/{:str_replace('\','/',$vo.house_pic)}" alt="Park" style="width:333px;height:219px;">
                        </a>
                        <div class="caption">
                            <h3 style="color:red;">￥{$vo['houseprice']}元/天</h3>
                            <p>
                                {$vo['house_name']}
                                <button data-id="{$vo['id']}" class="btn collect">收藏</button>
                            </p>
                        </div>
                    </div>
                </div>
                {/volist}

            </div>
        </div>
    </div>
</div>
<!--<script src="/static/index/js/jquery.min.js"></script>-->
<script>
    $(function(){
        $('.collect').click(function(){
            //获取当前房源信息id

            collect_id = $(this).attr('data-id');

            var t  = this;
            if($(this).html() == '收藏'){
                $.ajax({
                    url: "/collects",
                    dataType : "json",
                    type: "post",
                    data: {"id" : collect_id},
                    success: function(data){

                        switch(data){
                            case 0: alert('收藏失败');break;
                            case 1: alert('收藏成功');$(t).html('取消收藏');break;
                            case 2: alert('该商品已被收藏');$(t).html('取消收藏');break;
                            case 3: alert('请先登录');break;
                        }
                    },
                    error: function(data){
                        alert('Ajax请求失败');
                    }
                });
            }
            if($(this).html() == '取消收藏') {

                $.ajax({
                    url: "/collect",
                    type: "post",
                    datatype: "json",
                    data: {"id" : collect_id},
                    success: function(data){
                        if(data){
                            alert('取消成功');
                            $(t).html('收藏');
                        }else{
                            alert('取消失败，请重试!');
                        }
                    },
                    error: function(data){
                        alert('Ajax请求失败');
                    }
                });
            }
        });
    });
</script>

{/block}

{block name="daohang"}
{/block}